{% load static %}
<table class="table table-bordered table-striped table-condensed">
  <thead>
    <tr>
      <th width="20%">Name</th>
      <th width="15%">Status</th>
      <th width="15%">Priority</th>
      <th width="20%">Date Due</th>
      
      
      <th width="8%">Actions</th>
    </tr>
  </thead>
  <tbody id="taskslist">
    {% for task in tasks %}
    <tr id="task{{ task.id }}">
      <td><a id="task{{ task.id }}name" href="#">{{ task.name }}</a></td>
      <td><a id="task{{ task.id }}status" href="#">{{ task.status }}</a></td>
      <td id="task{{ task.id }}priority">{{ task.priority }}</td>
      <td id="task{{ task.id }}start_date">{{ task.start_date }}</td>
      
      
      <td>
        <div class="dropdown">
          <button class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
          Action
          <span class="caret"></span></button>
          <ul class="dropdown-menu">
            <li><a class="viewthis" href="#">View</a></li>
            <li><a class="editthis" href="#">Edit</a></li>
            <li><a class="removethis" href="#">Remove</a></li>
            {#
            <li><a href="#">Complete</a></li>
            #}
          </ul>
        </div>
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>
{% if tasks|length == 0 %}
<div class="heading text-center"> No Tasks found</div>
{% endif %}
<div class="pagination_row text-center row marl">
  <ul class="pagination">
    <li>
      {% if tasks.has_previous %}
      <a class="paginate-me" href="?page={{ tasks.previous_page_number }}">Previous</a>
      {% endif %}
    </li>
    <li>
      {% for page in tasks.paginator.page_range %}
    <li class="{% if tasks.number == page %}active{% endif %}"><a class="paginate-me"
      href="?page={{ page }}">{{ page }}</a>
    </li>
    {% endfor %}
    </li>
    <li>
      {% if tasks.has_next %}
      <a class="paginate-me" href="?page={{ tasks.next_page_number }}">Next</a>
      {% endif %}
    </li>
  </ul>
</div>
<script src="{% static 'js/setstatus.js' %}"></script>